/**
 * create by young (young2f@outlook.com) on 2020/9/16
 */


'use strict';
import React from 'react';
import {Button, Form, Input, notification} from 'antd';

import FormBase from '../../../components/Base/FormBase';
import {connect} from "dva";
import moment from 'moment';
import 'moment/locale/zh-cn';
import DescGroup from "../../../components/DescriptionGroup";
import ViewTitle from "../../../components/ViewTitle";
import {FormField, FormLayout, ModalFooter} from "antd-extra";
import notify from "../../../components/NotificationExtra";

moment.locale('zh-cn');
const table = 'ProcureOrder';
@Form.create()
@connect(({user, global, dynamicLabel, material, store}) => ({...user, ...material, ...dynamicLabel, ...global, ...store}))
export default class ModalPaid extends FormBase {
  constructor(props) {
    super(props);
    this.state = {};
  }

  componentDidMount() {
    const {values, isReview, dispatch} = this.props;
    if (isReview) return;
    dispatch && dispatch({
      type: 'global/getModel',
      payload: {table: 'InboundOrder'},
    });
    const {code} = values;
    dispatch && dispatch({
      type: 'store/inboundFindMany',
      payload: {orderCode: code},
    })
  }

  renderFoot = () => {
    const {foot, value, modalRef, form, callback} = this.props;

    if (foot) {
      return foot(value, modalRef);
    } else {
      return (
        <ModalFooter>
          <Button type="primary" onClick={() => {
            const {modalRef} = this.props;
            form.validateFields((err, values) => {
              if (err) {
                const {code} = err;
                const {errors} = code;
                errors.forEach(item => {
                  notification.error(item);
                });
                return;
              }
              callback(values)
              modalRef.close();
            })
          }}>确定</Button>

          <Button  onClick={() => {
            modalRef.close();
          }}>取消</Button>
        </ModalFooter>
      );
    }
  };

  render() {
    const {style, values, inboundOrder = {}, form, cols = 3} = this.props;
    const model = this.props[`${table}Model`];
    const inboundModel = this.props[`InboundOrderModel`];

    if (!model) return
    const {labels = []} = model;
    const _labels = [];
    const _values = _.cloneDeep(values)
    _.map(model, (item, key) => {
      const {enableArea} = item;
      if (key !== 'labels' && _.includes(enableArea, 'detail')) {
        item.key = key;
        _labels.push(item)
      }
    })

    _.map(labels, (item) => {
      const {key, inputType} = item;
      _labels.push(item)

      if (inputType.toLowerCase() === 'switch') {
        const value = _values[key];
        const _v = (value === undefined || value === null || value === "") && value.toLowerCase() !== 'true' ? "否" : '是';
        _values[key] = _v;
      }
    })

    const inboundLabels = [];
    _.map(inboundModel, (item, key) => {
      const {enableArea} = item;
      if (key !== 'labels' && _.includes(enableArea, 'detail')) {
        item.key = key;
        inboundLabels.push(item)
      }
    })

    return (
      <div style={{...style}}>
        <ViewTitle
          title={'采购单信息'}
          level={1}
        ></ViewTitle>
        <DescGroup
          {...{
            labels: _labels,
            values: _values,
            size: 'small',
            column: cols,
          }}
        ></DescGroup>
        {<ViewTitle
          title={'入库单信息'}
          level={1}
        ></ViewTitle>}
        {
          <DescGroup
            {...{
              labels: inboundLabels,
              values: inboundOrder,
              size: 'small',
              column: cols,
            }}
          ></DescGroup>
        }
        {<ViewTitle
          title={'付款信息'}
          level={1}
        ></ViewTitle>}
        {<FormLayout form={form} cols={cols}>
          <FormField
            label={'付款金额'}
            name={'paid'}
            required
          >
            <Input style={{width: '100%'}}
            ></Input>
          </FormField>
        </FormLayout>}
        {this.renderFoot()}
      </div>

    );
  }
}

